<template>
    <ul class="bread">
        <li v-for="(item, index) in breadArr" :key="index">
            <span>{{ item }}</span> <i>/</i>
        </li>
    </ul>
</template>

<script>
export default {
    data () {
        return {};
    },
    props: ["breadArr"],
}
</script>
 
<style lang = "less" scoped>
.bread {
    color: #999;
    display: flex;
    margin-top: 60px;
    margin-bottom: 20px;
    li {
        font-size: 16px;
        cursor: pointer;
        i {
            margin-right: 6px;
        }
        &:last-of-type {
            i {
                display: none;
            }
        }
        &:last-of-type {
            span {
                font-weight: bold;
                color: #000;
            }
        }
    }
}
</style>